<!DOCTYPE html>
<html class="x-admin-sm">
    
    <head>
        <meta charset="UTF-8">
        <title>ginadmin</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
        <link rel="stylesheet" href="./css/font.css">
        <link rel="stylesheet" href="./css/xadmin.css">
        <script src="./lib/layui/layui.js" charset="utf-8"></script>
        <script type="text/javascript" src="./js/xadmin.js"></script>
        <script type="text/javascript" src="./js/jquery.min.js"></script>
        <script type="text/javascript" src="./js/utils.js"></script>
    </head>
    
    <body>
        <div class="x-nav">
            <span class="layui-breadcrumb">
                <a href="">首页</a>
                <a>
                    <cite>菜单管理</cite></a>
            </span>
            <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" onclick="location.reload()" title="刷新">
                <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i>
            </a>
        </div>
        <div class="layui-fluid">
            <div class="layui-row layui-col-space15">
                    <div>
                        <table id="demoTreeTb"></table>
                        <script type="text/html" id="delivery-table-operate">
                            <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="edititem">编辑</a>
                            <a class="layui-btn layui-btn-xs layui-btn" lay-event="addmenu">添加</a>
                            <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="delmenu">删除</a>
                        </script>
                    </div>
            </div>
        </div>
    </body>
    <script type="text/javascript" src="/js/treeTable.js"></script>
    <script>
        //配置 layui 树形table 文档地址: https://gitee.com/whvse/treetable-lay/wikis/pages?sort_id=1986092&doc_id=142114
        layui.config({
            base: '/view/js/' //假设这是你存放拓展模块的根目录
        }).extend({ //设定模块别名
            treeTable: 'treeTable' //如果 mymod.js 是在根目录，也可以不用设定别名
        });
        var treeTable
        layui.use(['laydate', 'form','treeTable'],
        function() {
            var laydate = layui.laydate;
            treeTable = layui.treeTable;
            console.log(treeTable)

            // 渲染树形表格
            var insTb = treeTable.render({
                elem: '#demoTreeTb',
                url: '/web/menu/list',
                tree: {
                    iconIndex: 2,           // 折叠图标显示在第几列
                    isPidData: true,        // 是否是id、pid形式数据
                    idName: 'ID',  // id字段名称
                    pidName: 'ParentId'     // pid字段名称
                },
                cols: [[
                    {type: 'numbers'},
                    {type: 'checkbox'},
                    {field: 'Name', title: '菜单名称'},
                    {field: 'Url', title: '菜单地址'},
                    {title: '操作', toolbar: '#delivery-table-operate'}
                ]]
            });

            treeTable.on('tool(demoTreeTb)', function(obj){
                let event = obj.event;
                let itemdata = obj.data;//所在行的所有相关数据
                if(event == 'addmenu'){
                    addmenu()
                }else if(event == 'edititem'){
                    edititem(itemdata);
                }else if(event == 'delmenu'){
                    deleteItem(itemdata);
                }
            });

            //执行一个laydate实例
            laydate.render({
                elem: '#start' //指定元素
            });

            //执行一个laydate实例
            laydate.render({
                elem: '#end' //指定元素
            });
        });

        function addmenu() {
            //TODO 弹出框
            xadmin.open('添加菜单','./menu-add.html',800,600)
        }

        function edititem(itemdata) {
            console.log(itemdata)
            alert("敬请期待")
            //xadmin.open('修改菜单','./menu-add.html?menuid='+itemdata.ID+'&url='+itemdata.Url+'&name='+itemdata.Name,800,600)
        }

        function deleteItem(itemdata){
           console.log(itemdata)
            httpRequest("/web/menu/del", {'menu':itemdata.ID},function(res){
                if(res.code == 200){
                    layer.msg("删除成功",{
                        time:2000,
                        end:function () {
                            window.location.reload();
                        }
                    })
                }else{
                    layer.msg("删除失败:" +  res.msg)
                }
            });
        }


    </script>

</html>